<!DOCTYPE html>
<html>
<head>
	<title>登录</title>
	<link href="/style/bootstrap.min.css" rel="stylesheet">
	<script src="/js/jquery.min.js"></script>
	<script src="/js/bootstrap.min.js"></script>
	<style type="text/css">
		html{
			background-image: url(./img/bg.jpg);
			background-size: 100% 100%;
			background-repeat: no-repeat;
			background-attachment:fixed;
		}
		.container{
			width: 300px;
			margin: 200px auto 0 auto;
			border-radius: 10px;
			padding: 20px;
			border: 1px solid #ddd;
			background-color: rgba(255,255,255,0.5);
		}
		body{
			background-color: transparent;
		}
		.inputArea{
		}
		h3{
			margin: 20px 0;
		}
		#tips{
			margin-top: 10px;
			text-align: center;
			color: red;
		}
	</style>
</head>
<body>
	<div class="container">
		<h3>药品进销存系统</h3>
		<div>
			<div class="form-group">
				<input type="text" class="form-control inputArea" id="account" placeholder="请输入账户" style="margin-bottom: 30px" maxlength="20">
				<input type="password" class="form-control inputArea" id="password" placeholder="请输入密码" maxlength="20">
			</div>
			<div class="radio" style="margin-top: 30px;">
				<label>
					<input type="radio" name="optionsRadios" id="admin" value="admin">管理员
				</label>
				<label>
					<input type="radio" name="optionsRadios" id="clerk" value="clerk" checked>业务员
				</label>
			</div>
			<div style="text-align: center;margin-top: 50px;">
				<button id="submit" style="width: 100%;" class="btn btn-primary">登录</button>
			</div>
			<p id="tips" style="display: none">登录错误</p>
		</div>
	</div>
	<script type="text/javascript">
		
		$("#submit").click(function(){
			var account = $("#account").val();
			var password = $("#password").val();
			var type = $("input[name='optionsRadios']:checked").val();
			if (account == undefined || account == "") {
				$("#tips").html("账号不能为空");
				$("#tips").show();
			} else 	if (password == undefined || account == "") {
				$("#tips").html("账号不能为空");
				$("#tips").show();
			} else {
				$.post("/api/login", {
					account: account,
					password: password,
					type: type
				},function(data,status){
					if (data.success == "ok") {
						console.log(data)
						if (type == "admin") {
							window.location.href = "/admin.html"
						}
						if (type == "clerk") {
							if (data.result.type == "sales") {
								window.location.href = "/sales.html"
							} else if  (data.result.type == "buyer") {
								window.location.href = "/buyer.html"
							} else if  (data.result.type == "check") {
								window.location.href = "/check.html"
							} else {
								$("#tips").html("无法辨别改用户类型");
								$("#tips").show();
							}  
						}
					} else {
						$("#tips").html(data.msg);
						$("#tips").show();
					}
				})
			}
		})

	</script>
</body>
</html>